import { createApp } from "vue";
import "normalize.css";
import "virtual:uno.css";
// import 'reset-css'
import "./style.css";
import App from "./App.vue";
import router from "./router";
import * as ElementPlusIconsVue from "@element-plus/icons-vue"; //引入图标
import { createPinia } from "pinia";
import piniaPluginPersistedstate from "pinia-plugin-persistedstate"; //引入pinia持久化插件
import ImgUpload from "./components/img-upload.vue";
import Cloud from "leancloud-storage";
import { BASE, ID, KEY } from "./config";
import "element-plus/dist/index.css"; //解决ElMessage样式丢失的问题
import directives from "./directives";
import "animate.css";
// SDK初始化，让SDK知道是谁在调用它
Cloud.init({
  appId: ID,
  appKey: KEY,
  serverURL: BASE,
});

const pinia = createPinia(); //创建pinia核心对象
pinia.use(piniaPluginPersistedstate); //配置持久化插件
const app = createApp(App);
// 使用for循环自动全局注册所有图标组件
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
  app.component(key, component);
}
app.component("img-upload", ImgUpload); //全局注册
// app.directive("permit", directives.permit);
// app.directive("hello", directives.hello);
type KeyType = keyof typeof directives; //动态获取对象的键名作为类型
for (const key in directives) {
  app.directive(key, directives[key as KeyType]);
}
app.use(router);
app.use(pinia); //注入pinia
app.mount("#app");
